<template>
  <div class="app-container">
    <section>
      <span
        style="font-size:20px;font-weight: bold; display:block;margin-bottom: 20px;text-align: center;"
      >验货入库单列表</span>
      <!--工具条-->
      <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
        <el-form :inline="true">
          <el-form-item>
            <el-date-picker
              :picker-options="pickerOptions"
              v-model="form.date"
              @change="dateChangebirthday1"
              type="daterange"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
            ></el-date-picker>
          </el-form-item>

          <el-form-item label="摘要">
            <el-input v-model="form.Summary" auto-complete="off" maxlength="12"></el-input>
          </el-form-item>
          <el-form-item label="验货订单号">
            <el-input v-model="form.OrderNo" auto-complete="off" maxlength="12"></el-input>
          </el-form-item>
          <!-- 单据状态 -->
          <el-form-item label="单据状态" prop="OrderStatus">
            <el-select v-model="form.OrderStatus" filterable placeholder="请选择单据状态">
              <el-option
                v-for="item in SKUSaleModeList"
                :key="item.OrderStatus"
                :label="item.OrderStatusName"
                :value="item.OrderStatus"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="Gett_cg_PurchaseReceiptList()">查询</el-button>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="addTo()">查看采购订单</el-button>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="Batch">批量审核</el-button>
            <el-button type="success" @click="Countertrial">批量反审</el-button>
          </el-form-item>
        </el-form>
      </el-col>

      <el-table
        :data="ReceiptList"
        height="720"
        border
        style="width: 100%"
        @selection-change="changeFun"
        :header-cell-style="{'background':'#F5F7FA','color':'#000',}"
      >
        <el-table-column type="selection" width="45"></el-table-column>
        <el-table-column prop="OrderNo" label="验货入库订单号" align="center"></el-table-column>
        <el-table-column prop="ParentNo" label="采购单编号" align="center">
          <template slot-scope="scope">
            <span @click="Jump(scope.row.POId)" class="but">{{scope.row.ParentNo}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="Creater" label="创建人" align="center"></el-table-column>
        <el-table-column prop="CreateDate" label="时间" :formatter="formatDate" align="center"></el-table-column>
        <el-table-column prop="Status" label="审核状态" align="center">
          <template slot-scope="scope">
            <div>
              <span v-if="scope.row.Status==0" style="color:#00D000">草稿</span>
              <span v-if="scope.row.Status==1" style="color:red">已审核</span>
              <span v-if="scope.row.Status==2">已删除</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="CheckerName" label="审核人" align="center"></el-table-column>
        <el-table-column prop="BranchName" label="仓库" align="center"></el-table-column>
        <el-table-column prop="Summary" label="摘要" align="center"></el-table-column>
        <el-table-column label="操作" width="200" align="center">
          <template slot-scope="scope">
            <el-button type="primary" @click="add(scope.row.PRID)">查看</el-button>
            <el-button type="danger" size="small" v-on:click="Delete(scope.row.PRID)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <!-- 删除提示框 -->
      <el-dialog title="提示" :visible.sync="OderVisible" width="30%">
        <span>确认删除吗</span>
        <span slot="footer" class="dialog-footer">
          <el-button @click="OderVisible = false">取 消</el-button>
          <el-button type="primary" @click="Deletet_cg_PurchaseReceipt()">确 定</el-button>
        </span>
      </el-dialog>
      <!-- 选择采购单界面 -->
      <el-dialog title="选择采购订单" width="80%" :visible.sync="editFormVisible">
        <el-table :data="List">
          <el-table-column prop="OrderNo" label="验货入库单号" align="center"></el-table-column>
          <el-table-column prop="CreaterName" label="创建人" align="center"></el-table-column>
          <el-table-column prop="CreateDate" :formatter="formatDate" label="时间" align="center"></el-table-column>
          <el-table-column prop="BillStatus" label="审核状态" align="center">
            <template slot-scope="scope">
              <div>
                <span v-if="scope.row.BillStatus==0">草稿</span>
                <span v-if="scope.row.BillStatus==1">已审核</span>
                <span v-if="scope.row.BillStatus==2">已删除</span>
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="ReceiptStatus" label="到货状态" align="center">
            <template slot-scope="scope">
              <div>
                <span v-if="scope.row.ReceiptStatus==0">未到货</span>
                <span v-if="scope.row.ReceiptStatus==1">部分到货</span>
                <span v-if="scope.row.ReceiptStatus==2">已到货</span>
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="PayStatus" label="付款状态" align="center">
            <template slot-scope="scope">
              <div>
                <span v-if="scope.row.PayStatus==0">未付款</span>
                <span v-if="scope.row.PayStatus==1">部分付款</span>
                <span v-if="scope.row.PayStatus==2">已付款</span>
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="TotalMoney" label="金额" align="center"></el-table-column>
          <el-table-column label="操作" width="100" align="center">
            <template slot-scope="scope">
              <el-button type="primary" @click="handleShop(scope.row.POId)">生成</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-dialog>
      <el-pagination
        background
        layout=" prev, pager, next, jumper"
        @current-change="handleCurrentChange"
        :page-size="pageSize"
        :total="total"
        style="float:right;margin-top: 10px;"
      ></el-pagination>
    </section>
  </div>
</template>

<script>
import {
  Gett_cg_PurchaseReceiptList,
  GetPurchaseArrivedList,
  GetPurchaseOrdersDetail,
  Deletet_cg_PurchaseReceipt,
  CheckPurchaseReceipt,
  UnCheckPurchaseReceipt
} from "@/api/api";
import Config from "../../api/config";
export default {
  data() {
    return {
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },

        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "昨天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "本周",
            onClick(picker) {
              const end = new Date();
              console.log(this);
              console.log(formatDate);
              var now = new Date(); //当前日期
              var nowDayOfWeek = now.getDay(); //今天本周的第几天
              var nowDay = now.getDate(); //当前日
              var nowMonth = now.getMonth(); //当前月
              var nowYear = now.getYear(); //当前年
              nowYear += nowYear < 2000 ? 1900 : 0; //
              var weekStartDate = new Date(
                nowYear,
                nowMonth,
                nowDay - nowDayOfWeek
              );
              const start = weekStartDate;
              start.setTime(start);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "上周",
            onClick(picker) {
              var now = new Date(); //当前日期
              var nowDayOfWeek = now.getDay(); //今天本周的第几天
              var nowDay = now.getDate(); //当前日
              var nowMonth = now.getMonth(); //当前月
              var nowYear = now.getYear(); //当前年
              nowYear += nowYear < 2000 ? 1900 : 0; //
              const start = new Date(
                nowYear,
                nowMonth,
                nowDay - nowDayOfWeek - 7
              );
              start.setTime(start);
              const end = new Date(
                nowYear,
                nowMonth,
                nowDay - nowDayOfWeek - 1
              );
              start.setTime(start);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "本月",
            onClick(picker) {
              var now = new Date(); //当前日期
              var nowDayOfWeek = now.getDay(); //今天本周的第几天
              var nowDay = now.getDate(); //当前日
              var nowMonth = now.getMonth(); //当前月
              var nowYear = now.getYear(); //当前年
              nowYear += nowYear < 2000 ? 1900 : 0; //
              const end = new Date();
              const start = new Date(nowYear, nowMonth, 1);
              start.setTime(start);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "上月",
            onClick(picker) {
              var now = new Date(); //当前日期
              var nowDayOfWeek = now.getDay(); //今天本周的第几天
              var nowDay = now.getDate(); //当前日
              var nowMonth = now.getMonth(); //当前月
              var nowYear = now.getYear(); //当前年
              nowYear += nowYear < 2000 ? 1900 : 0; //
              var lastMonthDate = new Date(); //上月日期
              lastMonthDate.setDate(1);
              lastMonthDate.setMonth(lastMonthDate.getMonth() - 1);
              var lastYear = lastMonthDate.getYear();
              var lastMonth = lastMonthDate.getMonth();
              //								const end = new Date();
              const start = new Date(nowYear, nowMonth - 1, 1);
              start.setTime(start);
              const end = new Date(
                nowYear,
                nowMonth - 1,
                getMonthDays(lastMonth)
              );
              start.setTime(start);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "近3天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "近5天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 5);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "近7天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近10天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 10);
              picker.$emit("pick", [start, end]);
            }
          }
        ]
      },
      checkval: [],
      OderVisible: false,
      editFormVisible: false,
      page: 1,
      pageSize: 100,
      total: 0,
      ReceiptList: [],
      List: [],
      form: {
        ParentNo: "",
        OrderNo: "",
        date: [],
        OrderStatus: -1,
        Status: -1,
        PaymentStatus: -1,
        ArrivalStatus: -1
      },
      SKUSaleModeList: [
        {
          OrderStatus: -1,
          OrderStatusName: "全部"
        },
        {
          OrderStatus: 0,
          OrderStatusName: "草稿"
        },
        {
          OrderStatus: 1,
          OrderStatusName: "审核"
        }
      ],
      ArrivalStatusList: [
        {
          ArrivalStatus: -1,
          ArrivalStatusName: "全部"
        },
        {
          ArrivalStatus: 0,
          ArrivalStatusName: "未到货"
        },
        {
          ArrivalStatus: 1,
          ArrivalStatusName: "部分到货"
        },
        {
          ArrivalStatus: 2,
          ArrivalStatusName: "已付款"
        }
      ],
      PaymentStatusList: [
        {
          PaymentStatus: -1,
          PaymentStatusName: "全部"
        },
        {
          PaymentStatus: 0,
          PaymentStatusName: "未付款"
        },
        {
          PaymentStatus: 1,
          PaymentStatusName: "部分付款"
        },
        {
          PaymentStatus: 2,
          PaymentStatusName: "已付款"
        }
      ]
    };
  },
  created() {
    this.Gett_cg_PurchaseReceiptList();
  },
  methods: {
    //复选框状态
    changeFun(val) {
      this.checkval = val;
    },
    //批量审核
    Batch() {
      //获得选中的数据
      //定义加载提示框
      var arrAll = this.checkval;
      if (arrAll == undefined || arrAll.length == 0) {
        //未选中数据提示框
        this.$alert("未选中有效数据", "提示", {
          confirmButtonText: "确定",
          callback: action => {
            return;
          },
          type: "warning"
        });
      } else {
        var arrSuccess = 0;
        var arrFail = 0;

        var arrSubmit = arrAll.slice(0, 10);
        if (arrSubmit.length > 0) {
          //加载提示框
          const loading = this.$loading({
            lock: true,
            text: "审核中",
            spinner: "el-icon-loading",
            background: "rgba(0, 0, 0, 0.7)"
          });

          var count = 0;
          var t = setInterval(() => {
            if (count >= arrSubmit.length) {
              clearInterval(t);

              var msc = `选中数据【${arrAll.length}】条 <br/> 提交数据【${arrSubmit.length}】条<br/>审核成功【${arrSuccess}】条 <br/> 审核失败【${arrFail}】条`;
              this.$alert(msc, "审核完成", {
                confirmButtonText: "确定",
                dangerouslyUseHTMLString: true
              });
              //关闭加载提示
              loading.close();
              this.Gett_cg_PurchaseReceiptList();
              //this.toggleSelection();
            }
          }, 1000);
          //            location.reload();
          //循环延迟0.5s调用接
          for (let i = 0; i < arrSubmit.length; i++) {
            var para = {
              SessionId: JSON.parse(localStorage.getItem("userinfo")).SessionId,
              PRID: arrSubmit[i].PRID
            };
            //接口
            CheckPurchaseReceipt(para).then(res => {
              res.data.Status == 1 ? arrSuccess++ : arrFail++;
              count++;
            });
          }
        }
      }
    },
    //批量反审
    Countertrial() {
      //获得选中的数据
      var arrAll = this.checkval;
      if (arrAll == undefined || arrAll.length == 0) {
        //未选中数据提示框
        this.$alert("未选中有效数据", "提示", {
          confirmButtonText: "确定",
          callback: action => {
            return;
          },
          type: "warning"
        });
      } else {
        var arrSuccess = 0;
        var arrFail = 0;

        var arrSubmit = arrAll.slice(0, 10);
        if (arrSubmit.length > 0) {
          //加载提示框
          const loading = this.$loading({
            lock: true,
            text: "反审中",
            spinner: "el-icon-loading",
            background: "rgba(0, 0, 0, 0.7)"
          });

          var count = 0;
          var t = setInterval(() => {
            if (count >= arrSubmit.length) {
              clearInterval(t);

              var msc = `选中数据【${arrAll.length}】条 <br/> 提交数据【${arrSubmit.length}】条<br/>反审成功【${arrSuccess}】条 <br/> 反审失败【${arrFail}】条`;
              this.$alert(msc, "反审完成", {
                confirmButtonText: "确定",
                dangerouslyUseHTMLString: true
              });
              //关闭加载提示
              loading.close();
              this.Gett_cg_PurchaseReceiptList();
              //this.toggleSelection();
            }
          }, 200);

          //循环延迟0.5s调用接
          for (var i = 0; i < arrSubmit.length; i++) {
            var para = {
              SessionId: JSON.parse(localStorage.getItem("userinfo")).SessionId,
              PRID: arrSubmit[i].PRID
            };
            //接口
            UnCheckPurchaseReceipt(para).then(res => {
              res.data.Status == 1 ? arrSuccess++ : arrFail++;
              count++;
            });
          }
        }
      }
    },

    Delete(PRId) {
      this.form.PRId = PRId;
      this.OderVisible = true;
    },
    dateChangebirthday1(val) {
      this.startTime = val;
    },

    formatDate: function(row) {
      var date = new Date(row.CreateDate);
      var yy = date.getFullYear();
      if (yy < 1900) yy = yy + 1900;
      var MM = date.getMonth() + 1;
      if (MM < 10) MM = "0" + MM;
      var dd = date.getDate();
      if (dd < 10) dd = "0" + dd;
      var hh = date.getHours();
      if (hh < 10) hh = "0" + hh;
      var mm = date.getMinutes();
      if (mm < 10) mm = "0" + mm;
      var ss = date.getSeconds();
      if (ss < 10) ss = "0" + ss;
      return yy + "年" + MM + "月" + dd + "日";
    },

    //删除
    Deletet_cg_PurchaseReceipt() {
      var self = this;
      var para = {
        SessionId: JSON.parse(localStorage.getItem("userinfo")).SessionId,
        PRID: this.form.PRId
      };
      Deletet_cg_PurchaseReceipt(para).then(res => {
        if (res.data.Status != 1) {
          this.$message({
            message: res.data.Description,
            type: "error"
          });
          this.OderVisible = false;
          return;
        } else {
          this.$message({
            message: res.data.Description,
            type: "success"
          });
          this.OderVisible = false;
        }
        this.Gett_cg_PurchaseReceiptList();
      });
    },

    GetPurchaseArrivedList() {
      var self = this;
      var para = {
        SessionId: JSON.parse(localStorage.getItem("userinfo")).SessionId,
        Page: this.page,
        PageSize: this.pageSize
      };
      GetPurchaseArrivedList(para).then(res => {
        if (res.data.Status != 1) {
          this.$message({
            message: res.data.Description,
            type: "error"
          });
          return;
        } else {
          var vdata = JSON.parse(Base64.decode(res.data.Data));
          console.log("获取订单列表", vdata);
          self.List = vdata.DataList;
          self.total = vdata.TotalCount;
        }
        self.skulistLoading = false;
      });
    },
    //获取验收入库单列表*
    Gett_cg_PurchaseReceiptList() {
      console.log("打桩测试机");
      var self = this;
      var para = {
        SessionId: JSON.parse(localStorage.getItem("userinfo")).SessionId,
        Page: this.page,
        Status: this.form.OrderStatus,
        PageSize: this.pageSize,
        Summary: this.form.Summary,
        OrderNo: this.form.OrderNo,
        ParentNo: this.form.ParentNo,
        StartDate: this.form.date ? this.form.date[0] : "",
        EndDate: this.form.date ? this.form.date[1] : ""
      };
      Gett_cg_PurchaseReceiptList(para).then(res => {
        if (res.data.Status != 1) {
          this.$message({
            message: res.data.Description,
            type: "error"
          });
          return;
        } else {
          var vdata = JSON.parse(Base64.decode(res.data.Data));
          console.log("这是验证返回数据的");
          console.log("获取订单列表", vdata);
          self.ReceiptList = vdata.DataList;
          self.total = vdata.TotalCount;
        }
        self.skulistLoading = false;
      });
    },
    handleLook(id) {
      this.getdetails();
      this.lookFormVisible = true;
    },
    handleShop(POID) {
      console.log(POID);
      this.$router.push({
        path: "/Inspection/Inspection",
        query: {
          POID: POID
        }
      });
    },

    addTo() {
      this.editFormVisible = true;
      this.GetPurchaseArrivedList();
    },

    add(PRID) {
      this.$router.push({
        path: "/Inspection/Inspection",
        query: {
          PRID: PRID
        }
      });
    },
    //跳转
    Jump(POId) {
      this.$router.push({
        path: "/Purchase/Orders",
        query: {
          POId: POId
        }
      });
    },
    //翻页
    handleCurrentChange(val) {
      this.page = val;
      this.Gett_cg_PurchaseReceiptList();
    }
  }
};
</script>

<style lang="scss" scoped>
.but {
  cursor: pointer;
  text-decoration: underline;
}
</style>>
